// src/router/index.tsx
import { lazy } from "react";
import { getGrammarList } from '@/config'

const Home = lazy(() => import("@/pages/Home"));
const About = lazy(() => import("@/pages/About"));
const Layout = lazy(() => import("@/Layout"));
const CodeBlock = lazy(() => import('@/components/CodeBlock'))
const Grammar = lazy(() => import('@/pages/grammar'))

const grammarModules = import.meta.glob('@/pages/grammar/**/index.tsx')
const gModules = Object.fromEntries(
  Object.entries(grammarModules).map(([path, factory]) => [
    path.split('/grammar/')[1].split('/index.tsx')[0],
    factory
  ])
)

export const routes = [
  {
    path: "/",
    // element: <Layout />,
    element: <Grammar/>,
    children: getGrammarList().map(_ => {
      // const LazyComp = lazy(() => import(`../pages/grammar/${_.path}`))
      console.error('_.path=>',_.path);
      const factory = gModules[_.path]
      const LazyComp = lazy(() => factory().then((mod: any) => ({ default: mod.default })) )
      return {
        path: _.path,
        element: <LazyComp />,
      }
    }),
  },
];
